<!DOCTYPE html>
<html lang="en" xmlns:sec="http://www.thymeleaf.org/extras/spring-security" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('全局配置')"/>
    <style>
        .dept-tree {
            width: 100%;
            height: -webkit-calc(100vh - 247px);
            height: -moz-calc(100vh - 247px);
            height: calc(100vh - 247px);
            margin-top: 20px;
        }

        .button {
            margin-top: 10px;
            width: 94%;
            margin-left: 3%;
            display: block;
            height: 40px;
            line-height: 40px;
            padding: 0 15px;
            white-space: nowrap;
            text-align: center;
            font-size: 14.5px;
            border: none;
            cursor: pointer;
            box-sizing: border-box;
            display: inline-block;
            outline: 0;
            border-radius: 2px;
            -webkit-appearance: none;
            box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
        }

        .button-primary {
            background-color: #5FB878;
            color: white;
        }

        .button-default {
            color: #2f495e;
            background-color: #edf2f7;
        }
    </style>
    <style>
        .user-main {
            width: calc(100% - 312px);
            float: right;
        }

        .user-left {
            width: 300px;
            float: left;
        }

        .user-collasped.user-main {
            width: 100%;
        }

        .user-collasped.user-left {
            width: 0px;
        }
    </style>
</head>
<body class="pear-container">
<!-- <div class="layui-card">
    <div class="layui-card-body">
        <form class="layui-form" action="" lay-filter="user-query-form">
            <div class="layui-form-item">
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-inline">
                    <input type="text" name="realName" placeholder="" class="layui-input">
                </div>
                <label class="layui-form-label">账号</label>
                <div class="layui-input-inline">
                    <input type="text" name="username" placeholder="" class="layui-input">
                </div>
                <button class="pear-btn pear-btn-md pear-btn-primary" lay-submit lay-filter="user-query">
                    <i class="layui-icon layui-icon-search"></i>
                    查询
                </button>

            </div>
        </form>
    </div>
</div> -->
<div class="user-left">
    <div class="layui-card">
        <div class="layui-card-body">
            <div style="overflow: auto">
                <ul class="dept-tree" data-id="0" id="dept-tree"></ul>
            </div>
        </div>
    </div>
</div>
<div class="user-main">

    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">配置</li>
                <li>待开发</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <form action="" class="layui-form layui-form-pane" lay-filter="autoConfigForm">
                        注意:自动生成父菜单必选
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">
                                    表名称
                                </label>
                                <div class="layui-input-inline">
                                    <input autocomplete="off" class="layui-input" id="tableName" name="tableName"
                                           type="text">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">
                                    表描述
                                </label>
                                <div class="layui-input-inline">
                                    <input autocomplete="off" class="layui-input" id="tableComment" name="tableComment"
                                           type="text">
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">
                                    作者
                                </label>
                                <div class="layui-input-inline">
                                    <input autocomplete="off" class="layui-input" name="author" th:value="${author}"
                                           type="text">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">
                                    <span class="layui-badge-dot"></span> 父菜单
                                </label>
                                <div class="layui-input-inline">
                                    <ul class="dtree" data-id="-1" id="selectParent" name="parentId"></ul>
                                </div>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <div class="layui-form-item" pane>
                                <label class="layui-form-label">自定义路径</label>
                                <div class="layui-input-block">
                                    <input autocomplete="off" class="layui-input" name="parentPath" placeholder="请输入标题"
                                           th:value="${parentPath}" type="text">
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="layui-tab-item"></div>
            </div>
        </div>
    </div>

    <div class="layui-card">
        <div class="layui-card-body">
            <table id="global-table" lay-filter="global-table"></table>
        </div>
    </div>
</div>
</body>

<script id="user-toolbar" type="text/html">
    <button class="pear-btn pear-btn-primary pear-btn-md" lay-event="createAdmin">
        <i class="pear-icon pear-icon-column-vertical"></i>
        生成后台类
    </button>
    <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="createHTML">
        <i class="pear-icon pear-icon-layout"></i>
        生成HTML
    </button>
    <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="view">
        <i class="pear-icon pear-icon-browse"></i>
        预览
    </button>
    <button class="pear-btn pear-btn-danger pear-btn-md" lay-event="zip">
        <i class="pear-icon pear-icon-browse"></i>
        生成zip
    </button>
    <button class="pear-btn pear-btn-warming pear-btn-md" lay-event="collasped">
        <i class="layui-icon layui-icon-screen-full"></i>
        放大
    </button>
</script>

<script id="user-bar" type="text/html">
    <button sec:authorize="hasPermission('/system/user/edit','sys:user:edit')"
            class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit"><i class="pear-icon pear-icon-edit"></i>
    </button>
    <button sec:authorize="hasPermission('/system/user/remove','sys:user:remove')"
            class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove"><i class="pear-icon pear-icon-ashbin"></i>
    </button>
</script>

<script id="user-enable" type="text/html">
    <input type="checkbox" name="enable" value="{{d.userId}}" lay-skin="switch" lay-text="启用|禁用"
           lay-filter="user-enable" {{ d.enable== true ? 'checked' : '' }} />
</script>

<script id="user-sex" type="text/html">
    {{#if (d.sex == 0) { }}
    <span>男</span>
    {{# }else if(d.sex == 1){ }}
    <span>女</span>
    {{# } }}
</script>

<script id="user-login" type="text/html">
    {{#if (d.login == 0) { }}
    <span>在线</span>
    {{# }else if(d.sex == 1){ }}
    <span>离线</span>
    {{# } }}
</script>

<th:block th:include="include :: footer"/>
<script>
    layui.use(['table', 'dtree', 'form', 'element', 'jquery'], function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var element = layui.element;
        var dtree = layui.dtree;
        var MODULE_PATH = rootPath + "/autoCodeController";
        var PERMISSION_PATH = rootPath + "/PermissionController";
        var tableName;
        var cols = [
            [
                /* {type: 'checkbox'}, */
                {title: '字段名', field: 'column_name', align: 'center', width: 110},
                {title: '实体名称', field: 'beanName', align: 'center'},
                {title: '数据库类型', field: 'column_type', align: 'center'},
                {title: 'JAVA类型', field: 'beanType', align: 'center'},
                {title: '主键', field: 'column_key', align: 'center'},
                {title: '是否自增', field: 'extra', align: 'center'},
                {title: '是否可为空', field: 'is_nullable', align: 'center'},
                {title: '默认值', field: 'column_default', align: 'center'},
                /*  {title: '操作', toolbar: '#user-bar', align: 'center'} */
            ]
        ]

        //权限树
        dtree.renderSelect({
            elem: "#selectParent",
            url: PERMISSION_PATH + "/selectParent",
            method: 'get',
            selectInputName: {nodeId: "pid"},
            skin: "layui",
            dataFormat: "list",
            response: {treeId: "id", parentId: "pid", title: "name"},  //修改response中返回数据的定义
            selectInitVal: "0"
        });

        table.render({
            elem: '#global-table',
            url: MODULE_PATH + '/queryTableInfo',
            page: false,
            cols: cols,
            zIndex: 120, //层优先级
            skin: 'line',
            height: 'full-148',
            toolbar: '#user-toolbar',
            text: {none: '暂无表字段信息'},
            defaultToolbar: [{layEvent: 'refresh', icon: 'layui-icon-refresh'}]
        });
        //文档地址：http://www.wisdomelon.com/DTreeHelper/
        dtree.render({
            elem: "#dept-tree",
            method: "get",
            height: 'full',
            url: MODULE_PATH + "/selectTables",
            dataFormat: "list",//配置data的风格为list
            icon: ["0", "-1"],
            line: true,//开启树线
            record: true,
            response: {treeId: "id", parentId: "parentId", title: "tableAndName"}
        });

        //tree点击事件
        dtree.on("node('dept-tree')", function (obj) {
            var field = form.val("user-query-form");
            field.tableName = obj.param.recordData.tableName;
            $("#tableName").val(obj.param.recordData.tableName);
            $("#tableComment").val(obj.param.recordData.tableComment);
            tableName = field.tableName;
            window.refresh(field);
        });
        /*
                $(".user-group").click(function(){
                    var group =  $(this).attr("user-group");
                    var field = form.val("user-query-form");
                    if(group==="-1"){
                        field.tableName = group;
                        $(this).removeClass("button-default");
                        $(this).prev().removeClass("button-primary");
                        $(this).prev().addClass("button-default");
                        $(this).addClass("button-primary");
                    }else{
                        field.tableName = group;
                        $(this).removeClass("button-default");
                        $(this).next().removeClass("button-primary");
                        $(this).next().addClass("button-default");
                        $(this).addClass("button-primary");
                    }
                    window.refresh(field);
                })
         */
        table.on('tool(global-table)', function (obj) {
            if (obj.event === 'remove') {
                window.remove(obj);
            } else if (obj.event === 'edit') {
                window.edit(obj);
            }
        });

        table.on('toolbar(global-table)', function (obj) {
            if (obj.event === 'createAdmin') {
                window.createAdmin();
            } else if (obj.event === 'refresh') {
                window.refresh();
            } else if (obj.event === 'createHTML') {
                window.createHTML(obj);
            } else if (obj.event === 'view') {
                window.view(obj);
            } else if (obj.event === 'zip') {
                window.zip(obj);
            } else if (obj.event == 'collasped') {
                if ($(".user-left").hasClass("user-collasped")) {
                    $(".user-left").removeClass("user-collasped");
                    $(".user-main").removeClass("user-collasped");
                } else {
                    $(".user-left").addClass("user-collasped");
                    $(".user-main").addClass("user-collasped");
                }
                table.resize();
            }
        });

        form.on('submit(user-query)', function (data) {
            window.refresh(data.field);
            return false;
        });


        //预览
        window.view = function () {
            if (tableName == null || tableName == "") {
                layer.msg("未选表！", {icon: 2, time: 1000});
                return
            }
            var autoConfigData = form.val("autoConfigForm");
            var urlpar = "tableName=" + autoConfigData.tableName + "&tableComment=" + autoConfigData.tableComment + "&author="
                + autoConfigData.author + "&pid=" + autoConfigData.pid;

            var index = layer.open({
                type: 2,
                title: '预览',
                shade: 0.1,
                maxmin: true,
                area: ['800px', '600px'],
                content: MODULE_PATH + "/viewAuto?" + urlpar
            });
            layer.full(index);
        }

        //zip
        window.zip = function () {
            if (tableName == null || tableName == "") {
                layer.msg("未选表！", {icon: 2, time: 1000});
                return
            }
            var autoConfigData = form.val("autoConfigForm");
            var urlpar = "tableName=" + autoConfigData.tableName + "&tableComment=" + autoConfigData.tableComment + "&author="
                + autoConfigData.author + "&pid=" + autoConfigData.pid;

            document.location.href = MODULE_PATH + "/createAutoZip?" + urlpar;
        }

        //生成后台
        window.createAdmin = function () {
            if (tableName == null || tableName == "") {
                layer.msg("未选表！", {icon: 2, time: 1000});
                return
            }
            var autoConfigData = form.val("autoConfigForm");
            var loading = layer.load();
            $.ajax({
                url: MODULE_PATH + "/createAuto",
                dataType: 'json',
                data: autoConfigData,
                contentType: 'application/x-www-form-urlencoded',
                type: 'post',
                success: function (result) {
                    layer.close(loading);
                    if (result.code == 200) {
                        layer.msg(result.msg, {icon: 1, time: 1000}, function () {

                        });
                    } else {
                        layer.msg(result.msg, {icon: 2, time: 1000});
                    }
                }
            })
        }


        window.createHTML = function () {
            layer.msg("开发中", {icon: 2, time: 1000});
        }

        window.refresh = function (param) {
            table.reload('global-table', {where: param});
        }
    })
</script>
</html>